<template>
    <div class="array"></div>
</template>
<script setup lang="ts">
import { onMounted } from 'vue'
import { myFlat } from './array'
import { resolve } from 'path'

const arr = [1, 2, [3, [4, 5], [6, 7], '8']]
console.log(myFlat(arr, 1))

console.log('----------------- array 方法的 this 指向问题---------------')
const obj = {
    name: 'foo',
    friends: ['Tom', 'Jeery', 'Bob'],
    findFriends: function () {
        console.log('findFriends', this)
        // 使用箭头函数 this 能指向 obj 对象
        this.friends.forEach((item) => {
            console.log('foreach', this)

            console.log(`${this.name} -- ${item}`)
        })
        // 使用普通函数 this 不能指向 obj 对象 指向 undefined
        this.friends.map(function (item) {
            console.log('map')

            // console.log(`${this.name}${item}`)
        })
    },
}
obj.findFriends()
console.log('----------------- array forEach 不能使用 async ---------------')

const names = ['Tom', 'Jeery', 'Bob']
console.log('names:', names)

const funCb = function (item: any, index: number) {
    return new Promise((resolve) => {
        setTimeout(() => {
            resolve(item)
        }, (3 - index) * 1000)
    })
}

names.forEach(async (item, index) => {
    const result = await funCb(item, index)
    console.log('forEach', result)
})
const result = names.map(async (item, index) => {
    return await funCb(item, index)
})
Promise.all(result).then(res => {
    console.log(res);
})

</script>
<style lang="scss" scoped>
.array {
}
</style>
